<template>
  <div class="wjf-component">
    <el-dialog title="导入客户价目表" :visible.sync="tempVisible" @closed="handlerClose">
      <div class="item">
        表名：<el-input v-model="temp.cnName" />
        备注：<el-input v-model="temp.cnDescription" />
        价格类型：<br/>
        <el-select v-model="temp.flag">
          <el-option label="一般价格" :value="2">一般价格</el-option>
          <el-option label="特殊价格" :value="3">特殊价格</el-option>
        </el-select>
      </div>
      <div class="item">
        <wjf-upload
          class="form-control"
          action="/api/price/imports"
          :delete-by-attach-id="true"
          v-if="tempVisible"
          is-import
          element-loading-text="正在导入！"
          :params="temp"
          @success="handleSuccess"
          :show-file-list="false"
          style="display:inline-block"
          show-success-msg
          list-type="text/picture"
        >
          <div slot="default">
            <el-link
              type="primary"
              size="small"
              icon="el-icon-upload2 is-under-line"
            >
              <span>导入客户价目表</span>
            </el-link>
          </div>
        </wjf-upload>
      </div>
    </el-dialog>
  </div>
</template>
<style scoped>
  .item {
    padding-bottom: 20px;
  }
</style>
<script>
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      tempVisible: false,
      temp: {
        cnName: '销售价目表-华东一般002',
        cnDescription: '华中、华东、山东、西北、西南川渝用基础一般价格',
        flag: 2
      }
    }
  },
  watch: {
    visible(val) {
      this.tempVisible = val
    }
  },
  methods: {
    handleSuccess(res) {
      this.$emit('importSuccess', res)
    },
    handlerClose() {
      this.$emit('closed')
    }
  }
}
</script>
